/* components/circle/circle.js */
Component({
    options: {
      multipleSlots: true // 在组件定义时的选项中启用多slot支持
    },
    properties: {
      value: {
        type: String,
        value: 'draw'
      },
    },
  
    data: { /*  私有数据，可用于模版渲染 */
      size: 0, /* 圆环盒子大小 size >= 2*x ( x 为canvas的绘制半径)*/
      step: 1,
      num: 100
    },
    methods:{
        startDrawing(){
            var value = Number(this.data.value)
            var that = this;
            var cxt = wx.createCanvasContext('canvasCircle',this);
            cxt.setLineWidth(6);
            cxt.setStrokeStyle('#eaeaea');
            cxt.setLineCap('round');
            cxt.beginPath();
            cxt.arc(30, 30, 26, 0, 2 * Math.PI, false);
            cxt.stroke();
            cxt.draw();
            var steps = 1,startAngle = 1.5 * Math.PI,endAngle = 0,speed = 100,sec = 100;
            function drawing (s, e) {
                var context = wx.createCanvasContext('canvasRing',that);
                context.setLineWidth(6);
                context.setStrokeStyle('#3E5A7F');
                context.setLineCap('round');
                context.beginPath();
                context.arc(30, 30, 26, s, e, false);
                context.stroke();
                context.draw();
            }
            endAngle = value * 2 * Math.PI  + startAngle;
            drawing(startAngle, endAngle);
        }
    },
    
  })